<div bsModal #createOrEditModal="bs-modal" (onShown)="onShown()" class="modal fade" tabindex="-1" role="dialog"
  aria-labelledby="createOrEditModal" aria-hidden="true" [config]="{ backdrop: 'static', keyboard: !saving }">
  <div class="modal-dialog modal-lg">
    <div class="modal-content">
      <form *ngIf="active" #userForm="ngForm" novalidate autocomplete="off">
        <div class="modal-header">
          <h4 class="modal-title">
            <span>报价单</span>
          </h4>
          <button type="button" class="close" (click)="close()" [attr.aria-label]="l('Close')" [disabled]="saving">
            <span aria-hidden="true">&times;</span>
          </button>
        </div>
        <div class="modal-body">
          <p-tabView>
            <p-tabPanel header="申请单">
              <div class="align-items-center" style="border: 1px solid #c7cdd9;padding: 0.571em 1em; ">
                <div class="row">
                  <div class="form-group col-md-3">
                    <label for="code">申请单号</label>
                  </div>
                  <div class="form-group col-md-9">
                    <label>{{workflow.code}}</label>
                  </div>
                </div>
                <div class="row">
                  <div class="form-group col-md-3">
                    <label for="technicalQualityAgreementCode">技术质量协议编号</label>
                  </div>
                  <div class="form-group col-md-9">
                    <label>{{workflow.technicalQualityAgreementCode}}</label>
                  </div>
                </div>
                <div class="row">
                  <div class="form-group col-md-3">
                    <label for="supplierUnit">供方单位</label>
                  </div>
                  <div class="form-group col-md-9">
                    <label>{{workflow.supplierUnit}}</label>
                  </div>
                </div>
                <div class="row">
                  <div class="form-group col-md-3">
                    <label for="flowExplain">外协原因</label>
                  </div>
                  <div class="form-group col-md-9">
                    <p>{{workflow.explain}}</p>
                  </div>
                </div>
              </div>
            </p-tabPanel>
            <p-tabPanel *ngFor="let item of tabPanels" header="{{item.title}} 报价单">
              <!-- <jhi-tabpage1></jhi-tabpage1> -->
              <!-- 直接写组件<jhi-tabpage1>可以正常渲染，但使用下面的动态{{}}就只渲染标签字符串 -->
              <div style="border: 1px solid #c7cdd9;">
                <awaitQuatationSupplier suppliername={{item.title}} workflowid="{{workflowid}}">
                </awaitQuatationSupplier>
              </div>
            </p-tabPanel>

          </p-tabView>
        </div>
        <div class="modal-footer">
          <button [disabled]="saving" type="button" class="btn btn-default" (click)="close()">
            取消
          </button>
          <button type="submit" (click)="save()" class="btn btn-primary2" [disabled]="!userForm.form.valid"
            [buttonBusy]="saving" [busyText]="l('SavingWithThreeDot')">
            <i class="fa fa-save"></i> <span>提交</span>
          </button>
        </div>
      </form>
    </div>
  </div>
</div>